import Vue from 'vue'
import App from './App.vue'
// 引入 element-ui
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import router from './router'

// 引入面包蟹组件
import HmBread from '@/components/hm-bread.vue'
// 引入 axios
import axios from 'axios'
// 引入 重置样式
import '@/styles/base.scss'
// 引入时间格式
import moment from 'moment'
Vue.use(ElementUI)

// 注册面包写的全局组件
Vue.component('HmBread', HmBread)

Vue.config.productionTip = false

// 1. 设置基本路径
axios.defaults.baseURL = 'http://localhost:3000'
// 2. 设置发送请求方式,存储到原型上,
Vue.prototype.$axios = axios

// 3. 配置 前置导航守卫
// 对于后台管理系统,除了登录页,所有的页面都要登录了,才可以访问
router.beforeEach((to, from, next) => {
  // 获取 token 令牌
  const token = localStorage.getItem('token')
  // 判断
  if (to.path === '/login' || token) {
    next() // 放行
  } else {
    router.push('/login') // 否则调回登录页,登录
  }
})

// 4. 准备全局过滤器,解决头像展示问题
Vue.filter('fixUrl', value => {
  // 我们自己上传的封面图片路径,是想对于自己服务器的路径,需要拼接上前缀
  // startsWith : 表示开头是以什么开始
  // 如果不是以 http 开头的,就执行下面的代码
  if (value.startsWith('http')) {
    return value
  } else {
    return axios.defaults.baseURL + value
  }
})

// 准备全局过滤器, 处理日期
Vue.filter('time', value => {
  return moment(value).format('YYYY-MM-DD HH:mm')
})

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')
